import { useEffect, useRef, useCallback } from 'react';
import { useLocation } from 'react-router-dom';
import { TaskExecutor, TaskLogs, TaskResults } from '../components/TaskExecution';
import { useTaskContext } from '../contexts/TaskContext';
import { useTaskExecutionContext } from '../contexts/TaskExecutionContext';
import { CustomTask } from '../components/HomeDashboard';
import { taskService } from '../services/ExecutionService';
import { useToast } from '../components/Toast';

// 主组件
export const TaskExecution = () => {
  const location = useLocation();
  const { tasks: templateTasks } = useTaskContext();
  const executedRef = useRef(false);
  const toast = useToast();
  const queueProcessingRef = useRef(false); // 跟踪队列处理状态
  
  const { 
    taskQueue,
    taskResults,
    outputFiles,
    executionLogs,
    isExecuting,
    addToQueue,
    executeTask,
    clearQueue,
    addLog,
    clearResults,
    clearOutputFile,
    clearLogs
  } = useTaskExecutionContext();

  // 处理队列中的任务
  const processQueue = useCallback(async () => {
    // 如果已经在处理队列或者当前有任务在执行，则不进行处理
    if (queueProcessingRef.current || isExecuting) {
      return;
    }

    // 获取队列中等待的任务
    const waitingTasks = taskQueue.filter(task => task.status === 'waiting');
    if (waitingTasks.length === 0) {
      return; // 没有等待的任务
    }

    // 标记开始处理队列
    queueProcessingRef.current = true;

    try {
      // 执行第一个等待的任务
      const nextTask = waitingTasks[0];
     
      addLog(`从队列中开始执行任务: ${nextTask.taskTitle}`);
      toast.info('执行队列任务', `开始执行: ${nextTask.taskTitle}`);
      
      
      const customTask: CustomTask = {
        id: nextTask.id,
        taskTitle: nextTask.taskTitle,
        taskGuide: nextTask.taskGuide,
        category: nextTask.taskGuide,
        saveToLibrary: false
      };
      
      await executeTask(customTask);
      toast.success('任务执行完成', `${nextTask.taskTitle} 已完成`);
      
    } catch (error) {
      addLog(`执行队列任务时出错: ${error instanceof Error ? error.message : '未知错误'}`);
      toast.error('任务执行错误', error instanceof Error ? error.message : '执行过程中发生未知错误');
    } finally {
      // 标记队列处理完成
      queueProcessingRef.current = false;
    }
  }, [addLog, executeTask, isExecuting, taskQueue, templateTasks, toast]);

  // 监听执行状态和队列变化，自动处理队列
  useEffect(() => {
    if (!isExecuting && taskQueue.length > 0 && !queueProcessingRef.current) {
      processQueue();
    }
  }, [isExecuting, taskQueue, processQueue]);


  const handleButtonClick = async (taskIds: string[])  => {
    // 只有点击页面上的按钮时，才清空当前任务结果、输出文件、输出日志
    if (taskIds.length > 0) {
      clearResults();
      clearOutputFile();
      clearLogs();
      batchExecuteTasks(taskIds);
    }
  }

  // 批量执行任务
  const batchExecuteTasks = async (taskIds: string[]) => {
    const uniqueTaskIds = taskIds.filter(id => !taskQueue.some(item => item.id === id));
    
    if (uniqueTaskIds.length === 0) {
      toast.warning('任务执行提示', '没有新的任务可以添加到队列');
      return;
    }

    // 首先将所有任务添加到队列
    const queuedTasks = uniqueTaskIds
      .map(id => {
        const taskTemplate = templateTasks.find(t => t.id === id);
        if (taskTemplate) {
          addToQueue({
            id,
            status: 'waiting',
            taskId: taskTemplate.id,
            taskTitle: taskTemplate.taskTitle,
            taskGuide: taskTemplate.taskGuide,
            priority: 'normal'
          });
          addLog(`添加任务至队列: ${taskTemplate.taskTitle}`);
          return taskTemplate;
        }
        return null;
      })
      .filter((task): task is NonNullable<typeof task> => task !== null);

    // 如果已经有任务在执行，则仅将任务添加到队列并返回
    if (isExecuting) {
      toast.info('任务已加入队列', `${queuedTasks.length}个任务已添加到队列，将在当前任务完成后依次执行`);
      return;
    }
    
    // 任务会通过队列处理器自动执行
    toast.info('任务执行', `准备执行队列中的任务`);
  };

  // 处理自定义任务和标准任务混合场景
  const handleMixedTasks = async (customTasks: CustomTask[], standardTaskIds: string[]) => {
    // 添加自定义任务到队列
    customTasks.forEach(task => {
      addToQueue({
        id: task.id,
        status: 'waiting',
        taskId: task.id,
        taskTitle: task.taskTitle,
        taskGuide: task.taskGuide,
        priority: 'normal'
      });
      addLog(`添加自定义任务至队列: ${task.taskTitle}`);
    });
    
    // 添加标准任务到队列(如果有)
    if (standardTaskIds.length > 0) {
      // 过滤掉自定义任务ID
      const remainingTaskIds = standardTaskIds.filter(id => 
        !customTasks.some(task => task.id === id)
      );
      
      if (remainingTaskIds.length > 0) {
        remainingTaskIds.forEach(id => {
          const taskTemplate = templateTasks.find(t => t.id === id);
          if (taskTemplate && !taskQueue.some(item => item.id === id)) {
            addToQueue({
              id,
              status: 'waiting',
              taskId: taskTemplate.id,
              taskTitle: taskTemplate.taskTitle,
              taskGuide: taskTemplate.taskGuide,
              priority: 'normal'
            });
            addLog(`添加标准任务至队列: ${taskTemplate.taskTitle}`);
          }
        });
      }
    }
    
    // 如果已经有任务在执行，则仅将任务添加到队列并返回
    if (isExecuting) {
      toast.info('任务已加入队列', `任务已添加到队列，将在当前任务完成后依次执行`);
      return;
    }
    
    // 任务会通过队列处理器自动执行
    toast.info('任务执行', `准备执行队列中的任务`);
  };

  // 处理从HomeDashboard传递过来的任务ID
  useEffect(() => {
    const state = location.state as { 
      selectedTaskIds?: string[], 
      customTasks?: CustomTask[], 
      fromPage?: string 
    } | null;
    
    if (state?.selectedTaskIds && state.selectedTaskIds.length > 0) {
      if (executedRef.current) return; // 防止重复执行
      executedRef.current = true;
      
      // 添加日志
      addLog(`从${state.fromPage}接收到 ${state.selectedTaskIds.length} 个任务`);
      const selectedTaskIds = [...state.selectedTaskIds]; // 创建副本避免引用问题

      // 通知用户收到了新任务
      toast.info('接收到新任务', `从${state.fromPage}接收到 ${state.selectedTaskIds.length} 个任务`);

      // 如果当前没有任务在执行，则可以清空队列；如果有任务在执行，则将新任务添加到现有队列中
      if (!isExecuting) {
        clearQueue();
        addLog('清空现有队列，准备执行新任务');
      } else {
        addLog('当前有任务正在执行，新任务将被添加到队列中');
      }

      // 添加一个短暂的延时，让用户有时间理解发生了什么
      setTimeout(() => {
        // 根据是否有自定义任务选择不同的处理方式
        if (state.customTasks && state.customTasks.length > 0) {
          addLog(`处理 ${state.customTasks.length} 个自定义任务`);
          handleMixedTasks(state.customTasks, selectedTaskIds);
        } else {
          // 只有标准任务
          batchExecuteTasks(selectedTaskIds);
        }
        
        // 立即清除location state避免重复执行
        window.history.replaceState({}, document.title);
      }, 1000);
    }
  // 只在location.state变化时执行，不依赖于函数引用
  // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [location.state]);

  return (
    <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
      <div className="max-w-[1200px] mx-auto p-6">
        <h1 className="text-2xl font-bold mb-8 dark:text-white">任务执行</h1>
        
        <div className="space-y-6">
          {/* 顶部任务执行器 */}
          <div>
            <TaskExecutor 
              tasks={templateTasks}
              isExecuting={isExecuting}
              onBatchExecute={handleButtonClick}
            />
          </div>
          
          {/* 下方两栏布局 */}
          <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
            {/* 左栏：日志 */}
            <div>
              <TaskLogs 
                logs={executionLogs.map(log => log.message)} 
              />
            </div>
            
            {/* 右栏：任务队列/结果和输出文件 */}
            <div className="space-y-6">
              <TaskResults 
                taskQueue={taskQueue}
                taskResults={taskResults}
                outputFiles={outputFiles}
                onDownload={(taskId, fileName) => {
                  taskService.downloadTaskFile(taskId, fileName);
                  toast.success('文件下载', '已开始下载文件');
                }}
              />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}; 